<!DOCTYPE html>
<html lang="en">

    <head>

        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="">
        <meta name="author" content="">

        <title>Kura's Hardware Shop</title>

        <!-- Bootstrap Core CSS -->
        <link href="css/bootstrap.min.css" rel="stylesheet">

        <!-- MetisMenu CSS -->
        <link href="css/plugins/metisMenu/metisMenu.min.css" rel="stylesheet">

        <!-- DataTables CSS -->
        <link href="css/plugins/dataTables.bootstrap.css" rel="stylesheet">

        <!-- Custom CSS -->
        <link href="css/sb-admin-2.css" rel="stylesheet">

        <!-- Custom Fonts -->
        <link href="font-awesome-4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
        <link rel = "stylesheet" type = "text/css" href = "css/style.css" />

        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
            <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
            <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->

    </head>

    <body>

        <?php
        session_start();
        if (!isset($_SESSION['role'])) {
            header("Location: login.php");
        }
        require_once './script/importScript.php';
        ?>
        <div id="wrapper">

            <!-- Navigation -->
            <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="index.html">Xin chào <?php echo $_SESSION['name'] ?></a> <!-- get User late -->
                </div>
                <!-- /.navbar-header -->

                <ul class="nav navbar-top-links navbar-right">

                    <li class="dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                            <i class="fa fa-user fa-fw"></i>  <i class="fa fa-caret-down"></i>
                        </a>
                        <ul class="dropdown-menu dropdown-user">
                            <li><a href="info.php"><i class="fa fa-user fa-fw"></i> Thông tin cá nhân</a>
                            </li>

                            <li class="divider"></li>
                            <li><a href="script/logoutScript.php"><i class="fa fa-sign-out fa-fw"></i> Đăng xuất</a>
                            </li>
                        </ul>
                        <!-- /.dropdown-user -->
                    </li>
                    <!-- /.dropdown -->
                </ul>
                <!-- /.navbar-top-links -->

                <div class="navbar-default sidebar" role="navigation">
                    <div class="sidebar-nav navbar-collapse">
                        <ul class="nav" id="side-menu">
                            <?php
                            if ($_SESSION['role'] == 1) {
                                ?>
                                <li>
                                    <a class="active" href="statistic.php"><i class="fa fa-bar-chart-o fa"></i> &nbspThống kê<span class="fa arrow"></span></a>
                                    <ul class="nav nav-second-level">
                                        <li>
                                            <a href="statistic.php">Doanh thu</a>
                                        </li>
                                    </ul>
                                </li>

                                <li>
                                    <a href="users.php"><i class="fa fa-user fa-fw"></i> Quản lí nhân viên</a>

                                    <!-- /.nav-second-level -->
                                </li>
                                <?php
                            }
                            ?>
                            <li>
                                <a href="customers.php"><i class="fa fa-wrench fa-fw"></i>&nbsp;Quản lí khách hàng</a>

                                <!-- /.nav-second-level -->
                            </li>
                            <li>
                                <a href="#"><i class="fa fa-shopping-cart fa-fw"></i> Quản lí sản phẩm<span class="fa arrow"></span></a>
                                <ul class="nav nav-second-level">
                                    <li>
                                        <a href="categories.php">Danh mục</a>
                                    </li>
                                    <li>
                                        <a href="manufacturers.php">Nhà sản xuất</a>
                                    </li>                                    
                                    <li>
                                        <a href="products.php">Sản phẩm</a>
                                    </li>
                                </ul>
                            </li>
                            <li>

                                <a href="#"><i class="fa fa-edit fa-fw"></i> Quản lí đơn hàng<span class="fa arrow"></span></a>
                                <ul class="nav nav-second-level">
                                    <li>
                                        <a href="orders_in.php">Hóa đơn nhập</a>
                                    </li>
                                    <li>
                                        <a href="orders_out.php">Hóa đơn xuất</a>
                                    </li>

                                </ul>
                            </li>
                        </ul>
                        <!-- /.nav-second-level -->
                    </div>
                    <!-- /.sidebar-collapse -->
                </div>
                <!-- /.navbar-static-side -->
            </nav>

            <!-- Page Content -->
            <div id="page-wrapper">
                <div class="row">
                    <div class="col-lg-12">
                        <h1 class="page-header">Quản lý hóa đơn nhập</h1>
                    </div>
                    <!-- /.col-lg-12 --> 
                    <div id="importTable">
                        <?php printImportTable(); ?>
                    </div>
                </div>
                <hr>
                <div class="row">
                    <div class="col-lg-12">
                        <button class="btn btn-primary" id='new' value="newImport">Thêm đơn hàng mới</button>
                    </div>
                </div>
                <!-- /.row -->
            </div>
            <!-- /#page-wrapper -->
        </div>
        <!-- /#wrapper -->

        <!-- Modal -->
        <div class="modal fade bs-example-modal-lg" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title" id="myModalLabel">Chi tiết nhập hàng</h4>
                    </div>
                    <div class="modal-body">
                        <div class='row'>
                            <div class='col-lg-12'>             
                                <div id="display" class='panel-body'>
                                    <!-- MODAL HERE -->
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type = button class="btn btn-primary" id='addRow' value='addRow'>Thêm dòng</button>
                        <button type="button" class="btn btn-warning" data-dismiss="modal">Đóng</button>
                        <a class="btn btn-danger" id='deleteImport' value="deleteImport">Xóa</a>
                        <a class="btn btn-success" id='saveChanges' value="saveChanges">Lưu</a>
                    </div>
                </div>
            </div>
        </div>
        <div id = "__suggest-panel_popup"></div>

        <!-- jQuery Version 1.11.0 -->
        <script src="js/jquery-1.11.0.js"></script>
        <script src="js/jquery-2.1.1.min.js"></script>

        <!-- Bootstrap Core JavaScript -->
        <script src="js/bootstrap.min.js"></script>

        <!-- Metis Menu Plugin JavaScript -->
        <script src="js/plugins/metisMenu/metisMenu.min.js"></script>

        <!-- Custom Theme JavaScript -->
        <script src="js/sb-admin-2.js"></script>

        <!-- DataTables JavaScript -->
        <script src="js/plugins/dataTables/jquery.dataTables.js"></script>
        <script src="js/plugins/dataTables/dataTables.bootstrap.js"></script>

        <!-- Suggest script -->
        <script type = 'text/javascript' src= 'js/script.js'></script>

        <script>
            $(document).ready(function() {
                $('#dataTables-example').dataTable();

            });
        </script>

        <script>
            $(document).ready(function() {
                var table = $('#dataTables-example').DataTable();

                document.getElementById('modify').href = "orders_in.php?" + table.$('input, select').serialize();
            });
        </script>

        <script>
            $("button").click(function() {
                if ($(this).attr("value").indexOf("editButton") != -1) { //hiển thị modal chi tiết đơn hàng
                    $list = $(this).attr("value").split("-")
                    $.ajax({
                        type: "POST",
                        url: "./script/importScript.php",
                        data: {id: $list[1]}})
                            .done(function(msg) {
                                $("#display").html(msg);
                            });
                } else if ($(this).attr("value").indexOf("deleteButton") != -1) {
                    $.ajax({
                        type: "POST",
                        url: "./script/importScript.php",
                        data: {type: "getProductName"}})
                            .done(function(msg) {
                                var availableTags = msg.split("*");
                                $("#productName").autocomplete({
                                    source: availableTags
                                });
                            });
                } else if ($(this).attr("value") === "addRow") { // thêm dòng mới
                    var str = "<tr>\n\
                                <td style='width:10%'><input style='width:100%' name=ipid value='NULL' readonly></td>\n\
                                <td style='width:60%'><input class='cpid' id ='pid' style='width:100%' onKeyUp = \"loadSuggest(this, 'product');\" onblur=\"changeprice(this);\" name=name></td>\n\
                                <td style='width:15%'><input style='width:100%' name=quantity value='1' onblur=\"changeprice(this);\"></td>\n\
                                <td style='width:15%'></td>\n\
                            </tr>";
                    $("#dataTables-details").append(str);
                } else if ($(this).attr("value") === "newImport") {
                    $.ajax({
                        type: "POST",
                        url: "./script/importScript.php",
                        data: {type: "newImport"}})
                            .done(function(msg) {
                                document.location.reload();
                            });
                }
            });

            $("a").click(function() {
                if ($(this).attr("value") === "saveChanges") {
                    var table = $('#dataTables-details').DataTable();
                    document.getElementById('saveChanges').href = "orders_in.php?type=update"
                            + "&iid=" + document.getElementById('iidinfo').value
                            + "&uid=" + document.getElementById('uidinfo').value
                            + "&did=" + document.getElementById('didinfo').value
                            + "&" + table.$('input, select').serialize();
                }
                else if ($(this).attr("value") === "deleteImport") {
                    var r = confirm("Bạn có chắc muốn xóa không?!");
                    if (r === true) {
                        document.getElementById('deleteImport').href = "orders_in.php?type=delete"
                                + "&iid=" + document.getElementById('iidinfo').value;
                    }
                }
            });
        </script> 


        <script>
            function changeprice(target) {
                $val = "";
                $quantity = 0;
                if ($(target).attr('id') === 'pid') {
                    $val = $(target).closest('td').find('input').val();
                    $quantity = $(target).closest('td').next().find('input').val();
                } else {
                    $val = $(target).closest('td').prev().find('input').val();
                    $quantity = $(target).closest('td').find('input').val();
                }
                $.ajax({
                    type: "POST",
                    url: "./script/importScript.php",
                    data: {type: "getprice",
                        pid: $val,
                        quantity: $quantity}})
                        .done(function(msg) {
                            if ($(target).attr('id') === 'pid') {
                                $(target).closest('td').next().next().html(msg);
                            } else {
                                $(target).closest('td').next().html(msg);
                            }
                        });
            }
        </script>
    </body>

</html>
